<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>编辑案例</title>
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<meta name="renderer" content="webkit|ie-stand |ie-comp">
		<!-- 指定以最新的IE版本模式来显示网页 -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<!-- 针对360浏览器的内核调用,强制调用极速模式 -->
		<meta name="renderer" content="webkit" />
		<link rel="stylesheet" href="../style/reset.css">
		<link rel="stylesheet" href="../style/wytiwen.css" />
		<link rel="stylesheet" href="../style/jlyrenwu.css" />
		<script type="text/javascript" src="../js/jquery.min.js" ></script>
		<script type="text/javascript" src="../js/mmlogin.js" ></script>
		<!--编辑器-->
		<link href="../themes/default/default.css" rel="stylesheet" />
		<script src="../js/kindeditor-all.js"></script>
		<script src="../js/emoticons.js"></script>
		<script src="../js/zh_CN.js"></script>
		<style>
			.wyrowbg{
				height: 1000px;
			}
			.mytw_right{
				height: 885px;
			}
			.bjbz{    display: inline-block;
			    background: #991f1f;
			    color: white;
			    padding: 5px 12px;
			    margin-left: 30px;
			    border-radius: 5px;
			    float: right;
			    margin-right: 260px;
			    margin-top: 2px;
			   }
			.bjbz:hover{
				background: #901c1c !important;
			}
			.ke-content{font-size: 14px;font-family: "微软雅黑";}
		</style>
	</head>
	<body>
		<!-- 公共顶部 S -->
	    <div class="row header-top">
	        <div class="container">
	            <div class="header-top-l fl">您好，欢迎来到房屋装修监理网!</div>
	            <div class="header-top-r fr">
	                <div class="htrdl"><a href="../mmlogin.html">登录</a></div>
	                <div class="htrdl"><a href="../register.html">注册</a></div>
	                <!-- 登陆后出现用户名 和 退出 -->
	                <!-- <div class="htrdl"><a>Andy233</a></div>
	                <div class="htrdl"><a href="">退出</a></div> -->
	                <span class="htrb"></span>
	                <div class="htr"><a href="../index-zxhd.html">最新活动</a></div>
	                <span class="htrb"></span>
	                <div class="htr"><a href="../index-gsjieshao.html">公司介绍</a></div>
	                <span class="htrb"></span>
	                <div class="htr"><a href="../index-ZXyuyue.html">免费预约</a></div>
	                <span class="htrb"></span>
	                <div class="htr mess"><a href="MyXTxiaoxi.html">消息<span>20</span></a></div>
	                <span class="htrb"></span>
	                <div class="htr"><a href="Myxiangmu.html">个人中心</a></div>
	                <span class="htrb"></span>
	            </div>
	        </div>
	    </div>
	    <div class="row header-logo">
	        <div class="container  header-conter">
	            <div class="hclogo fl">
	                <a href="index.html"><img src="../image/logo.png"></a>
	            </div>
	            <div class="hcsearch">
	                <div class="hcsearl fl">
	                    <select>
	                        <option>监理现场</option>
	                        <option>监理案例</option>
	                        <option>装修攻略</option>
	                        <option>维权视频</option>
	                    </select>
	                </div>
	                <div class="hcsearc fl">
	                    <input type="text">
	                </div>
	                <div class="hcsearr fr">
	                    搜索
	                </div>
	            </div>
	            <div class="hctex fr">
	                <img src="../image/tel.png" style="margin-right: 40px;">
	                <img src="../image/wx.png">
	            </div>
	        </div>
	    </div>
	    <div class="row header-bottom">
	        <div class="container">
	            <a class="hbmain fl" href="../index.html">首页</a>
	            <a class="hbnav fl" href="../index-jlfw.html">监理服务</a>
	            <a class="hbnav fl" href="../index-jlxc.html">监理现场</a>
	            <a class="hbnav fl" href="../index-jlal.html">监理案例</a>
	            <a class="hbnav fl" href="../index-zxgl.html">装修攻略</a>
	            <a class="hbnav fl" href="../index-wqsp.html">维权视频</a>
	            <a class="hbnav fl" href="../index-zxgs.html">装修公司</a>
	        </div>
	    </div>
	    <!--公共顶部 E -->
	
	    <!-- 首页banner S-->
	    <!-- 首页 -->
		<div class="row wyrowbg">
			<div class="container">
				<div class="mytw_left">
					<div class="per_til">个人中心</div>
					<div class="wdxm_box">
						我的项目
						<a href="Myxiangmu.html">我的项目</a>
						<a href="YKwodezhuye.html">我的主页</a>
						<a href="JLYrenwu.html" class="active">我的任务</a>
					</div>
					<div class="wdxm_box tiwen">
						我的问答
						<a href="MyYtiwen.html">我要提问</a>
						<a href="MyDtiwen.html">我的提问</a><span class="jiaobiao">99</span>
						<a href="MyDhuida.html">我的回答</a>
					</div>
					<div class="wdxm_box">
						我的关注
						<a href="MyDguanzhu.html">我的关注</a>
					</div>
					<div class="wdxm_box">
						消息通知
						<a href="MyXTxiaoxi.html">系统消息</a><span class="jiaobiao">99</span>
						<a href="MySQxiaoxi.html">申请消息</a><span class="jiaobiao">99</span>
						<a href="MySDpinglun.html">收到的评论</a><span style="margin-right: 103px;" class="jiaobiao">99</span>
						<a href="MySDzan.html">收到的赞</a><span class="jiaobiao">99</span>
					</div>
					<div class="wdxm_box">
						设置权限
						<a href="MySZquanxian.html">设置权限</a>
					</div>
					<div class="wdxm_box">
						邀请好友
						<a href="MyYQhaoyou.html">邀请好友</a>
					</div>
					<div class="wdxm_box" style="border-bottom: none;">
						我的个人资料
						<a href="MyGRziliao.html">个人资料</a>
						<a href="MyXGtouxiang.html">修改头像</a>
						<a href="MyXGmima.html">修改密码</a>
						<a href="MyXGshouji.html">修改手机</a>
					</div>
				</div>
				<!--右边box-->
				<div class="mytw_right">
					<div class="rightbox">
						<p class="rta">萧山瑞博-林之语二期三室两厅监理记录</p>
						<!--<a class="bjbz" href="JLYbianjianlie01.html">编辑步骤</a>-->
						<div class="ratb">
							<p>监理公司</p>
							<select id="sel1">
								<option value="0">选择监理公司</option>
								<option value="1">杭州旭尧建筑工程监理有限公司</option>
							</select>
						</div>
						
						<p class="al1"></p>
						<div class="ratc">
							<p>监理级别</p>
							<select id="sel2">
								<option value="0">选择监理级别</option>
								<option value="1">监理员</option>
								<option value="1">监理师</option>
								<option value="1">高级监理师</option>
							</select>
						</div>
						<p class="al2"></p>
						<div class="ratd">
							<p>装修公司</p>
							<select id="sel3">
								<option value="0">选择装修公司</option>
								<option value="1">监理员</option>
								<option value="1">监理师</option>
								<option value="1">高级监理师</option>
							</select>
						</div>
						<p class=" al3"></p>
						
						<!--现场简介-->
						<div class="rate">
							<p>现场简介</p>
							<div class="tera">
								<form>
									<textarea name="content" class="textare" style="width:780px;height:200px;visibility:hidden;resize: none;" placeholder="请输入监理现场的文字（选填）"></textarea>
								</form>
							</div>
							<p class="al4"></p>
						</div>
						<!--上传图片-->
						<div class="ratf">
							<p>封面照片</p>
						    <div id="preview">
		                        <img id="imghead" border="0" src="../image/bj1.png" width="150" height="100" onclick="$('#previewImg').click();">
		                     </div>         
		                    <input type="file" onchange="previewImage(this)" id="previewImg" style="opacity: 0;"/>
            			</div>
            			<p class="al5"></p>
            			<a class="jlbtn">提交</a>
					</div>
				</div>
			</div>
		</div>
		
    	<!--公共底部 S-->
    	<script>
      //图片上传预览    IE是用了滤镜。
        function previewImage(file)
        {
          var MAXWIDTH  = 90; 
          var MAXHEIGHT = 90;
          var div = document.getElementById('preview');
          if (file.files && file.files[0])
          {
              div.innerHTML ='<img id=imghead onclick=$("#previewImg").click()>';
              var img = document.getElementById('imghead');
              img.onload = function(){
                var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
                img.width  =  rect.width;
                img.height =  rect.height;
//                 img.style.marginLeft = rect.left+'px';
                img.style.marginTop = rect.top+'px';
              }
              var reader = new FileReader();
              reader.onload = function(evt){img.src = evt.target.result;}
              reader.readAsDataURL(file.files[0]);
          }
          else //兼容IE
          {
            var sFilter='filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src="';
            file.select();
            var src = document.selection.createRange().text;
            div.innerHTML = '<img id=imghead>';
            var img = document.getElementById('imghead');
            img.filters.item('DXImageTransform.Microsoft.AlphaImageLoader').src = src;
            var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
            status =('rect:'+rect.top+','+rect.left+','+rect.width+','+rect.height);
            div.innerHTML = "<div id=divhead style='width:"+rect.width+"px;height:"+rect.height+"px;margin-top:"+rect.top+"px;"+sFilter+src+"\"'></div>";
          }
        }
        function clacImgZoomParam( maxWidth, maxHeight, width, height ){
            var param = {top:0, left:0, width:width, height:height};
            if( width>maxWidth || height>maxHeight ){
                rateWidth = width / maxWidth;
                rateHeight = height / maxHeight;
                
                if( rateWidth > rateHeight ){
                    param.width =  maxWidth;
                    param.height = Math.round(height / rateWidth);
                }else{
                    param.width = Math.round(width / rateHeight);
                    param.height = maxHeight;
                }
            }
            param.left = Math.round((maxWidth - param.width) / 2);
            param.top = Math.round((maxHeight - param.height) / 2);
            return param;
        }
    </script>
    <script>
		var editor;
		KindEditor.ready(function(K) {
			editor = K.create('textarea[name="content"]', {
				resizeType : 1,
				allowPreviewEmoticons : false,
				allowImageUpload : false,
				items : [
				        'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'code', 'cut', 'copy', 'paste',
				        'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
				        'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
				        'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
				        'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
				        'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'multiimage',
				        'flash', 'media', 'insertfile', 'table', 'hr', 'emoticons', 'baidumap', 'pagebreak',
				        'anchor', 'link', 'unlink', '|', 'about'
				]
			});
		});
	</script>
	
	</body>
</html>
